<div class="app-content m-n h-full">

<div class="hbox hbox-auto-xs bg-light h-full" ng-controller="RestfullCtrl">
	<div class="col w-lg lt b-r">
    	<div class="vbox">
      		<div class="wrapper"><div class="h4">Restfull API</div></div>
	      	<div class="wrapper b-t m-t-xxs">
	        	<div class="input-group">
	          		<span class="input-group-addon input-sm"><i class="fa fa-search"></i></span>
	          		<input id="filter" type="text" class="form-control input-sm" placeholder="search user">
	        	</div>
	      	</div>
	      	<div class="row-row hidden-xs">	      
           		<div class="padder">
             		<div class="list-group">
		                <a id="{{org.orgId}}" ng-repeat="org in orglist" class="list-group-item b-l-{{orgcolor[$index%6]}} b-l-3x hover-anchor" 
		                		ng-class="{'hover': org.selected }" ng-click="selectOrg(org)">
		                	<span class="block text-ellipsis zn-font">{{org.orgName}}</span>
		                  	<small class="text-muted">{{org.orgCreatedon}}</small>
		                </a>
             		</div>
           		</div>
	        </div>	        
    	</div>
	</div>

  	<div class="col">
   		<div class="vbox">
      		<div class="wrapper bg-light lt b-b hidden-xs">
      			<span class="text-muted"> Current organizetion <i class="fa fa-fw fa-angle-right text"></i> </span>
      			<span class="zn-font"> {{!org?'All of company':org.orgName}} </span>
      		</div>
      		<div class="row-row"> 
          		<div class="wrapper">
					 <div class="panel panel-default">
					 	<div class="panel-heading">
					    	<button class="btn m-b-xs w-xxs btn-success" ng-click="open('Add')">Add</button>
					    	<button class="btn m-b-xs w-xs btn-default" ng-click="open('Modify')">Modify</button>
					    	<button class="btn m-b-xs w-xs btn-default" ng-click="del()">Delete</button>
					    </div>
					    <div>
					      	<table class="table m-b-none zn-font" ui-jq="footable"  data-filter="#filter" data-filter-minimum="1" data-page-size="7">
						        <thead>
						        	<tr>
						            	<th data-sort-ignore="true" style="width: 20px;"><label class="i-checks m-b-none"><input type="checkbox"><i></i></label></th>
						            	<th data-hide="phone"> Code </th>
						              	<th data-toggle="true"> Name </th>
						              	<th data-hide="phone"> Org Name </th>
						              	<th data-hide="phone"> Role </th>
						              	<th> Mobile </th>
						              	<th data-hide="phone"> Status </th>
						        	</tr>
						        </thead>
						        <tbody>
						        	<tr ng-if="!userlist"><td colspan="7" class="text-center"><i class="fa fa-spin fa-spinner"></i></td></tr>
						        	<tr ng-repeat="user in userlist">
										<td><label class="i-checks m-b-none"><input type="checkbox" name="ids" value="{{user.userId}}"><i></i></label></td>
						              	<td>{{user.userCode}}</td>
						              	<td>{{user.userName}}</td>
						              	<td>{{user.sweetDemoOrg.orgName}}</td>
						              	<td>
						              		<i ng-if="user.userRole==2" class="glyphicon glyphicon-user  text-danger-dk" tooltip="管理员"></i>
						              		<i ng-if="user.userRole!=2" class="glyphicon glyphicon-user  text-info-dk" tooltip="用户"></i>		
						              	</td>
						              	<td>{{user.userMobile}}</td>
						              	<td>
						              		<span ng-if="user.userStatus==1" class="label bg-info">Active</span>
						              		<span ng-if="user.userStatus!=1" class="label bg-light">Disabled</span>						              		
						              	</td>
						          	</tr>
						        </tbody>																	        																							
						        <tfoot class="hide-if-no-paging" ng-if="userlist">
						        	<tr><td colspan="7" class="text-center">
						            	<ul class="pagination"></ul>
						        	</td></tr>
						        </tfoot>
					    	</table>
					    </div>
					</div>
				</div>
        	</div>    
    	</div>
  	</div> 	
</div>